<!doctype html>
<html lang="en">
    <head>
        <title>SCG :: #{get 'title' /}</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" media="screen" href="@{'/public/stylesheets/main.css'}">
        <link rel="stylesheet" media="screen" href="@{'/public/stylesheets/layout.css'}">
        <link rel="stylesheet" media="screen" href="@{'/public/stylesheets/isotope.min.css'}">
        <link rel="stylesheet" media="screen" href="@{'/public/javascripts/jquery-ui/sunny/css/jquery-ui-1.8.16.custom.css'}">
        <link rel="stylesheet" media="screen" href="@{'/public/javascripts/jquery-layout-1.2.0/layout-default.css'}">
        #{get 'moreStyles' /}
        <link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
        <script src="@{'/public/javascripts/jquery-1.5.2.min.js'}" type="text/javascript" charset="UTF-8"></script>
        <script src="@{'/public/javascripts/jquery-ui/sunny/js/jquery-ui-1.8.16.custom.min.js'}" type="text/javascript" charset="UTF-8"></script>
        <script src="@{'/public/javascripts/jquery-layout-1.2.0/jquery.layout.min.js'}" type="text/javascript" charset="UTF-8"></script>
        <script src="@{'/public/javascripts/jquery.isotope.min.js'}" type="text/javascript" charset="UTF-8"></script>
        
        #{get 'moreScripts' /}
    
    <style type="text/css">
	html, body {
		background:	#EEE;
		width:		100%;
		height:		100%;					
		padding:	0;
		margin:		0;
		overflow:	auto; /* when page gets too small */
	}
	#container {
		background:	#EEE;
		/* HEIGHT */
		height:		100%;					
		min-height:	300px;
		_height:	300px; /* min-height for IE6 */
		/* WIDTH */
		width:		100%;
		max-width:	900px;
		min-width:	700px;
		_width:		700px; /* min-width for IE6 */
		/* HORIZONTAL CENTERING */
		margin:		0 auto;
	}
	/*
	 *	Container sizing
	 *
	 *	Borders and padding are normally *added* to the width/height of the DIV
	 *	However you can get height:100% AND padding/borders by using a nested layout. 
	 *	The outer-layout is just a single pane: center, which is where you add your vertical padding.
	 *	Inside this is your *real layout*. 
	 */
	#paddingWrapper {
		background:	#EEE;
		padding:	20px 10px;
		border:		4px solid #BBB;
	}
	.pane {
		display:	none; /* will appear when layout inits */
	}
	</style>
        
        <script type="text/javascript">
        $(document).ready(function () {
    		$('#container').layout();
    		$('#paddingWrapper').layout();
    	});

        </script>
    </head>
    <body>

<div id="container">
	<div id="paddingWrapper" class="pane ui-layout-center">
		<div class="pane ui-layout-center">
			 #{doLayout /}
		</div>
		<div class="pane ui-layout-north">SCGPROBONO Admin</div>
		<div class="pane ui-layout-south" style="text-align: right;">Copyrigyt &copy; Social Consulting Group. All rights reserved.</div>
		<div class="pane ui-layout-west">
		    <ul>
			    <li><span>컨텐츠 관리</span>
			    	<ul>
			    		<li> - <a href="@{admin.ImageContents.list()}">메인화면 이미지 관리</a></li>
			    	</ul>
			    </li>
		    	<li><span>사용자관리</span>
		    		<ul>
						<li> - <a href='@{admin.Users.list()}'>계정관리</a></li>
						<li> - <a href=''>프로보노 지원자</a></li>
					</ul>
		    	</li>	    	
		    	<li><span>신청서 관리</span>
					<ul>
		    			<li> - <a href="#">프로보노</a></li>
		    			<li> - <a href="#"></a></li>
		    		</ul>
		    	</li>	
		    	<li><span>게시판 관리</span>
		    		<ul>
		    			<li> - <a href="#">공지사항</a></li>
		    			<li> - <a href="#">컬럼</a></li>
		    		</ul>
		    	</li>
		    </ul>
		    
		</div>
	</div>
</div>

    </body>
</html>
